<!DOCTYPE html>
<html class="ui-page-login">

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title></title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/app.css" />
		<script src="js/mui.min.js"></script>
		<script src="js/mui.enterfocus.js"></script>
		<script src="js/app.js"></script>
		<style>
			.area {
				margin: 20px auto 0px auto;
			}
			
			.mui-input-group {
				margin-top: 10px;
			}
			
			.mui-input-group:first-child {
				margin-top: 20px;
			}
			
			.mui-input-row label {
				width: 90px;
				padding: 10px 0 10px 15px;
			}
			
			.mui-input-row label~input {
				float: left !important;
			}
			
			.mui-content-padded {
				margin-top: 30px;
			}
			
			.mui-content {
				margin-top: -20px;
			}
			.mui-btn {
				padding: 10px;
			}
			
			.link-area {
				display: block;
				margin-top: 25px;
				text-align: center;
			}
			
			.spliter {
				color: #bbb;
				padding: 0px 8px;
			}
			
			.oauth-area {
				position: absolute;
				bottom: 20px;
				left: 0px;
				text-align: center;
				width: 100%;
				padding: 0px;
				margin: 0px;
			}
			
			.oauth-area .oauth-btn {
				display: inline-block;
				width: 50px;
				height: 50px;
				background-size: 30px 30px;
				background-position: center center;
				background-repeat: no-repeat;
				margin: 0px 20px;
				/*-webkit-filter: grayscale(100%); */
				border: solid 1px #ddd;
				border-radius: 25px;
			}
			
			.oauth-area .oauth-btn:active {
				border: solid 1px #aaa;
			}
			
			.oauth-area .oauth-btn.disabled {
				background-color: #ddd;
			}
			
			.logo {}
		</style>

	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<h1 class="mui-title">登录</h1>
		</header>

		<div class="mui-content">

			<form id='login-form' class="mui-input-group">
				&nbsp;&nbsp; &nbsp;&nbsp;
				&nbsp;&nbsp; &nbsp;&nbsp;
				<div class="logo">
					<center><img src="images/user-photo.png" id="logo" style="width: 120px; height: 120px;" /></center>

				</div>
				&nbsp;&nbsp; &nbsp;&nbsp;
				<div class="mui-input-row">
					<label>账&nbsp;&nbsp;&nbsp;号</label>
					<input id='phone' type="text" class="mui-input-clear mui-input" placeholder="请输入11位账号" onBlur="findImgByLoginName()" style="width:140px ;" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}">
					<span id="phoneText" style="color: red;line-height: 40px;"></span>

				</div>
				<div class="mui-input-row two">
					<label>密&nbsp;&nbsp;&nbsp;码</label>
					<input id='password' type="password" class="mui-input-password mui-input " placeholder="请输入密码">
				</div>

			</form>

			<div class="mui-content-padded">
				<button id='login' class="mui-btn mui-btn-block mui-btn-primary" onclick="loginSend()">登录</button>
				<div class="link-area">
					<a id='reg' href="reg.html">注册账号</a> <span class="spliter">|</span>
					<a id='forgetPassword' href="forget_password.html">忘记密码</a>
				</div>
			</div>
			<div class="mui-content-padded oauth-area">

			</div>
		</div>

		<script>
			mui.init();
			mui.plusReady(function() {
			
	    	var ifLogin = localStorage.getItem("ifLogin");//登陆状态
	    	//关闭全部窗体
	    	var all = plus.webview.all(); 
			var current = plus.webview.currentWebview().id; 
			for(var i=0,len=all.length;i<len;i++){ 
			    if(all[i].id!==current){ 
			        all[i].close('none'); 
			    } 
			} 
	    	
			if(ifLogin=="true"){
				
				plus.webview.currentWebview().hide();
				
				mui.openWindow({
									url: 'phoneIndex.html',
									id: 'phoneIndex.html',
								});
			}else if(ifLogin=="false"){
				
			
			}
		
				
					
					
	});
			
		
		
		
		//变量
		
			var nameEl = document.getElementById("phone");
			var passwordEl = document.getElementById("password");
			//登陆
			function loginSend() {
				
				//验证电话号码手机号码 

				if(nameEl.value != "" && passwordEl.value != "") {
					var network = true;
					var stateId=generateUUID();	
					var s1="";
					s1=stateId;
					if(mui.os.plus) {
						mui.plusReady(function() {
							if(plus.networkinfo.getCurrentType() == plus.networkinfo.CONNECTION_NONE) {
								network = false;
							}
						});
					}
					if(network) {
						console.log('网络正常,正在发送请求...');

						//phoneText.innerHTML = '手机格式符合';
						mui.ajax({
							type: "post",
							url: "http://113.71.26.27:8080/tpl/phone/plogin",
							async: true,
							data: {
								name: nameEl.value,
								password: passwordEl.value,
								stateId:s1
							},
							dataType: "json",
							timeout: 2000,
							crossDomain: true,
							success: function(data) {
								console.log('响应成功！');
								console.log(data);
								//var sure2 = JSON.stringify(data.loginName);
								//console.log(sure2);
								var SName = data.loginName;
								if(nameEl.value ==SName) {
									if(data.state=='false'){//没登陆
										
										alert('登录成功');
									
									plus.webview.currentWebview().hide();
									//plus.webview.open('phoneIndex.html','phoneIndex.html');
									localStorage.setItem("loginName",SName);
									localStorage.setItem("employeeid",data.id);
									console.log(data.id);
									localStorage.setItem("ifLogin","true");//登陆状态
									localStorage.setItem("stateId",s1);
									mui.openWindow({
										url: 'phoneIndex.html',
										id: 'phoneIndex.html',
										
									});
									changeState('false');
									}else if(data.state=='true'){
										var stateId2=generateUUID();
										var s2="";
										s2=stateId2;
										show_confirm(nameEl.value);
										changeStateId(s2);//修改标识码
										localStorage.setItem("stateId",s2);
										localStorage.setItem("employeeid",data.id);
									}
									
								} else
									alert('密码错误！');
							},
							error: function(xhr, type, errorThrown) {
								plus.nativeUI.toast(errorThrown);
							}
						});

					} else {
						mui.toast("当前网络不给力，请稍后再试...");
					}

				} else {
					plus.nativeUI.toast('输入不能为空！', {
						verticalAlign: 'center'
					});

				}

			}
			
			function show_confirm(SName){ //已登陆业务
		    var result = confirm('账号已登录，是否继续登录！');  
		    if(result){  
		    	plus.webview.currentWebview().hide();
		        localStorage.setItem("loginName",SName);
				localStorage.setItem("ifLogin","true");//登陆状态
					mui.openWindow({
						url: 'phoneIndex.html',
						id: 'phoneIndex.html',
										
					}); 
		        
		    }else{  
		        //不继续登陆
		    }  
		}
			
			
			
			//改变登陆状态
			function changeState(state){
				console.log('改变登陆状态');
				mui.ajax({
							type: "post",
							url: "http://113.71.26.27:8080/tpl/phone/changeState",
							async: true,
							data: {
								name: nameEl.value,
								state: state
								
							},
							dataType: "json",
							timeout: 2000,
							crossDomain: true,
							success: function(data) {
								console.log('响应成功！');
								
								
							},
							error: function(xhr, type, errorThrown) {
								plus.nativeUI.toast(errorThrown);
							}
						});
				
			}
			
			//修改标识码
			function changeStateId(stateId){
				var name=localStorage.getItem("loginName");
				console.log('查看登陆状态');
				mui.ajax({
							type: "post",
							url: "http://113.71.26.27:8080/tpl/phone/changeStateId",
							async: true,
							data: {
								name: name,
								stateId:stateId
								
							},
							dataType: "json",
							timeout: 2000,
							crossDomain: true,
							success: function(data) {
								console.log('响应成功！');
								
								
							},
							error: function(xhr, type, errorThrown) {
								plus.nativeUI.toast(errorThrown);
							}
						});
				
			}
			//产生唯一标识
			function generateUUID() {
			var uuid="";
			var d = new Date().getTime();
			 uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
			  var r = (d + Math.random()*16)%16 | 0;
			  d = Math.floor(d/16);
			  return (c=='x' ? r : (r&0x3|0x8)).toString(16);
			});
			return uuid;
			};



			function findImgByLoginName() {
				var network = true;
				var phone = document.getElementById("phone");
				var phoneText = document.getElementById("phoneText");
				if(mui.os.plus) {
					mui.plusReady(function() {
						if(plus.networkinfo.getCurrentType() == plus.networkinfo.CONNECTION_NONE) {
							network = false;
						}
					});
				}
				if(phone.value != "") {
					if(network) {
						console.log('网络正常,正在发送请求...');

						mui.ajax({
							type: "post",
							url: "http://113.71.26.27:8080/tpl/phone/getPhoneImg",
							async: true,
							data: {
								loginName: phone.value
							},
							dataType: "json",
							timeout: 2000,
							crossDomain: true,
							success: function(data) {
								console.log('响应成功！');
								console.log(data);

								var SName = data.loginName;
								//console.log(SName); 
								if(SName == phone.value) {
									var photoUrl = data.imgUrl;
									var logo = document.getElementById('logo');
									logo.src = "http://113.71.26.27:8080/tpl/public/uploadImage/peopleLogo/" + photoUrl;
									phoneText.innerHTML = '';
								} else {

									var logo2 = document.getElementById('logo');
									logo2.src = "images/user-photo.png";
									phoneText.innerHTML = '账号不存在';
									phoneText.style.color = 'red';

								}

							},
							error: function(xhr, type, errorThrown) {
								plus.nativeUI.toast(errorThrown);
							}
						});

					} else {
						mui.toast("当前网络不给力，请稍后再试...");
					}
				} else {

					phoneText.innerHTML = '帐号不能为空';
					phoneText.style.color = 'red';
				}
			}
		</script>

		<script>
			/*
			var phone = document.getElementById("phone");
										     mui.init();    
										     mui.plusReady(    
										        function() {    
										           document.getElementById("login").addEventListener('tap', function(){ 
										           	
														plus.webview.currentWebview().hide();
														plus.webview.open('phoneIndex.html','phoneIndex.html');	
														localStorage.setItem("loginName",phone.value);
										                mui.openWindow({
											                 url:'PhoneIndex.html',
															id:'PhoneIndex.html'
															
														});
															
										                
										            });   
										        }    
										      ); */ 
		</script>
	</body>

</html>